<template>
  <div>
    <div>
      <el-input v-model="projectDocName" placeholder="请输入文档标题"></el-input>
    </div>
    <div id="markdown">
      <mavon-editor v-model="initContent" @save="save" @change="change" :editable="markdownStatus"/>
    </div>
  </div>
</template>


<script>

  import Vue from 'vue'
  import mavonEditor from 'mavon-editor'
  import 'mavon-editor/dist/css/index.css'

  import api from "@/assets/js/project/project_doc_add.js";
  import common from "@/assets/js/common/common.js";

  Vue.use(mavonEditor);

  export default {
    //数据类型
    data() {
      return {
        initContent: "",
        projectDocId: null,
        projectInfoId: null,
        projectDocName: null,
        markdownStatus: true
      }
    },
    //在components中引入子组件
    components: {},
    //初始化加载
    mounted: function () {
      //获取项目主键
      if (this.$route.params.projectInfoId) {
        this.projectInfoId = this.$route.params.projectInfoId
      } else if (localStorage.getItem("projectInfoId")) {
        this.projectInfoId = localStorage.getItem("projectInfoId")
      } else {
        common.message("无法获取项目信息", "warning");
        return;
      }
      //执行定时器，自动保存
      this.timer = setInterval(this.save, 1000 * 60 * 5);

    },
    //具体js方法
    methods: {
      change(value, render) {
        if (value != null) {
          this.initContent = value;
        }
      },
      save(value, render) {
        // console.log("value:", value);
        // console.log("render:", render);
        this.initContent = value;
        if (this.projectInfoId == null || this.projectInfoId == '') {
          common.message("无法获取项目信息！", "error");
          return;
        }
        if (this.projectDocName == null || this.projectDocName == '') {
          common.message("文档标题不能为空！", "warning");
          return;
        }
        if (this.initContent == null) {
          common.message("无法获取文档内容，取消自动保存操作！", "warning");
          return;
        }
        if (this.projectDocId == null || this.projectDocId == '') {
          // console.log("新增");
          //新增操作
          api.saveDoc({
            projectInfoId: this.projectInfoId,
            projectDocName: this.projectDocName,
            markdownDoc: this.initContent,
            // htmlValue: render
          }).then((res) => {
            common.generalMessage(res);
            // console.log(res);
            this.projectDocId = res.data.projectDocId;
          });
        } else {
          // console.log("更新");
          // 更新操作
          api.updateDoc({
            projectDocId: this.projectDocId,
            projectInfoId: this.projectInfoId,
            projectDocName: this.projectDocName,
            markdownDoc: this.initContent,
            // htmlValue: render
          }).then((res) => {
            common.generalMessage(res);
          });
        }

      }
    }
  }
</script>


<style scoped>


</style>
